<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>生物特征识别中心</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta http-equiv="Content-Language" content="zh-CN"/>
    <link rel="stylesheet" href="__CSS__/bootstrap.css">
    <link rel="stylesheet" href="__CSS__/my.css">
</head>
<body>
{$nav}
<div class="container" id="container">
    <!-- ===============标题=================== -->
    <div>
        <div class="row">
            <div class="col-sm-5">
                <span class="heading" id="header"></span>
            </div>
            <div class="col-sm-1">
                <button type="button" class="btn btn-lg btn-link btn-header"
                        onclick="$('#modal-screening').modal('show');"><span class="glyphicon glyphicon-retweet"
                                                                             style="font-size: 16px"></span>&nbsp;筛选
                </button>
            </div>
            <div class="col-sm-1">
                <button type="button" class="btn btn-lg btn-link btn-header" data-toggle="modal"
                        data-target="#modal-add" onclick="$('#add-failed').hide();"><span
                        class="glyphicon glyphicon-plus" style="font-size: 16px"></span>&nbsp;新增
                </button>
            </div>
            <div class="col-sm-5">
                <div class="input-group" style="margin:25px 30px 0 30px">
                    <input type="text" class="form-control" id="search-box" placeholder="请输入全部或部分样品编号">
                    <span class="input-group-btn">
                        <button class="btn btn-primary"
                                onclick="displayData(1,'Sample',{data:{'id_group':{$id},'search_sample_name':$('#search-box').val()}})"><span
                                class="glyphicon glyphicon-search"></span>&nbsp;</button>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="modal-screening">
        <div class="modal-dialog" style="width: 500px">
            <div class="modal-content">
                <div style="padding: 20px 20px;">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">×</span></button>
                    <h4 class="modal-title">筛选选项</h4>
                </div>
                <div class="modal-body" align="center">
                    <form class="form-horizontal" id="form-screening" style="padding-right: 20px">
                        <input type="hidden" name="id_group" value="{$id}">
                        <div class="form-group">
                            <label for="screening-type" class="col-sm-3 control-label">样品类型：</label>
                            <div class="col-sm-9">
                                <select class="form-control type-select" id="screening-type" name="id_type">
                                    <option value="">不限</option>
                                </select>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-default" data-dismiss="modal"><span
                            class="glyphicon glyphicon-remove"></span>&nbsp;取消
                    </button>
                    <button class="btn btn-primary" data-dismiss="modal"
                            onclick="displayData(1,'Sample',{data:$('#form-screening').toJson()})"><span
                            class="glyphicon glyphicon-ok"></span>&nbsp;提交
                    </button>
                </div>
            </div>
        </div>
    </div>
    <table class="table table-hover" id="table-data">
        <thead>
        <tr>
            <th>#</th>
            <th>样品编号</th>
            <th>样品类型</th>
            <th>所属委托</th>
            <th>姓名</th>
            <th>性别</th>
            <th>民族</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="tbody">
        </tbody>
    </table>
    <!--=================添加(modal)====================-->
    <div class="modal fade" id="modal-add">
        <div class="modal-dialog">
            <div class="modal-content">
                <div style="margin: 20px 20px;">
                    <div>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">×</span></button>
                        <h4 class="modal-title">新增样品</h4>
                    </div>
                    <form class="form-horizontal" id="form-add" style="padding-right: 30px">
                        <div style="height: 30px"></div>
                        <input type="hidden" name="id_group" value="{$id}">
                        <div class="form-group">
                            <label for="add-sample-name" class="col-sm-3 control-label">样品编号</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="add-sample-name" name="sample_name"
                                       placeholder="请输入委托名称">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="add-sample-type" class="col-sm-3 control-label">样品类型</label>
                            <div class="col-sm-9">
                                <select class="form-control type-select" id="add-sample-type" name="id_type">
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="add-person-name" class="col-sm-3 control-label">姓名</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="add-person-name" name="person_name"
                                       placeholder="请输入送检人员姓名">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="add-person-sex" class="col-sm-3 control-label">性别</label>
                            <div class="col-sm-9">
                                <select class="form-control" name="person_sex" id="add-person-sex">
                                    <option value="">未知</option>
                                    <option value="0">男</option>
                                    <option value="1">女</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="add-person-race" class="col-sm-3 control-label">民族</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="add-person-race" name="person_race"
                                       placeholder="请输入民族">
                            </div>
                        </div>
                    </form>
                    <div id="add-result" hidden="true"></div>
                    <div class="modal-footer" id="form-add-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="submit" class="btn btn-primary" id="form-add-submit">提交</button>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!--=================编辑(modal)====================-->
    <div class="modal fade" id="modal-update" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div style="margin: 20px 20px;">
                    <div>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">×</span></button>
                        <h4 class="modal-title">编辑样品</h4>
                    </div>
                        <form class="form-horizontal" id="form-update" style="margin-right: 30px">
                            <div style="height: 30px"></div>
                            <input type="text" id="update_id" name="id" hidden="true">
                            <div class="form-group">
                                <label for="update_sample_name" class="col-sm-3 control-label">样品编号</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="update_sample_name" name="sample_name">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="update_id_type" class="col-sm-3 control-label">样品类型</label>
                                <div class="col-sm-9">
                                    <select class="form-control type-select" id="update_id_type" name="id_type">
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="update_person_name" class="col-sm-3 control-label">姓名</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="update_person_name" name="person_name">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="update_person_sex" class="col-sm-3 control-label">性别</label>
                                <div class="col-sm-9">
                                    <select class="form-control" name="person_sex" id="update_person_sex">
                                        <option value="未知">未知</option>
                                        <option value="男">男</option>
                                        <option value="女">女</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="update_person_race" class="col-sm-3 control-label">民族</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="update_person_race" name="person_race">
                                </div>
                            </div>
                            <div id="update-result" hidden="true"></div>
                            <div style="height: 20px"></div>
                        </form>

                        <div class="modal-footer" id="form-update-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="button" class="btn btn-primary" id="form-update-submit">提交</button>
                        </div>
                </div>
            </div>
        </div>
    </div>

    <!--分页页码-->
    <div align="center">
        <ul class="pagination" id="pager"></ul>
    </div>
</div>

</body>
<script src="__JS__/jquery-3.2.1.min.js"></script>
<script src="__JS__/jquery.cookie.js"></script>
<script src="__JS__/bootstrap.min.js"></script>
<script src="__JS__/my.js"></script>
<script type="text/javascript">
    $.post('/sample_rsv/Group/get',{'needle':'name','id':{$id}},function (data) {
        $("#header").html('委托'+data+'包含的样品');
    });

    displayData(1, "Sample", {data: {"id_group": {$id}}});

    /*========================显示现有样品类型===========================*/
    $.post('/sample_rsv/SampleType/getAll', null, function (data) {
        for (var index_type in data) {
            $(".type-select").append("<option value='" + data[index_type].id + "'>" + data[index_type].name + "</option>");
        }
    });

    /*========================编辑样品===========================*/
    function form_update(id_sample) {
        $.post('/sample_rsv/Sample/getById', {"id": id_sample}, function (data) {
            var arr_sample = data;
            for (index_sample in arr_sample) {
                var element = $("#update_" + index_sample);
                if (element.length > 0) element.val(arr_sample[index_sample]);
            }
            $("#modal-update").modal('show');
        });
    }

    $("#form-update-submit").click(function () {
        $.post('/sample_rsv/Sample/edit', {data:$("#form-update").toJson()}, function (data) {
            $("#update-result").showAjaxResult(data, '成功更新', '个样品');
        });
    });

    $("#form-add-submit").click(function () {
        $.post('/sample_rsv/Sample/add',{data:$("#form-add").toJson()},function (data) {
            $("#add-result").showAjaxResult(data);
        })
    })

</script>
</html>
